html[data-theme='dark'] {
  /* text */
  --text-primary: #dedede;
  --text-secondary: #e0a68d;
  --text-tertiary: #eee6e6;
  --text-grey: rgb(212, 212, 212);
  --text-01: #EBDBA4;
  --text-02: #EBDBA4;
  --text-03: #bad88d;
  /* link */
  --text-link: #569af9;
  --text-link-hover: #c3d8ff;
  --text-visited: #551a8b;
  /* bgc */
  --background-primary: #353533;
  --background-secondary: #2f312f;
  --background-tertiary: #2b2e2e;
  --bgc-01: #425947;
  --bgc-02: #313131;
  --bgc-03: #252525;
  --bgc-04: #3c4336;
  --btn-bgc: #6b7abb;
  --btn-hover: #5665a8;
  --btn-active: #2a366e;
  --btn-bgc-1: #aa795d;
  --btn-hover-1: #926d48;
  --btn-active-1: #6e4e2a;
  /* border */
  --border-primary: #566c5e;
  --border-secondary: #63767a;
  /* icon */
  --icon-bgc: #878c4f;

  /* banner */
  --site-banner-bgc: rgb(22, 22, 21);
  --site-banner-linear: linear-gradient(120deg, rgb(40, 49, 42) 0%, #1D2021 100%);
  --site-banner-border: rgb(58, 68, 55);
  --site-banner-emboss-l: rgb(222, 216, 199);
  --site-banner-emboss-r: rgb(88, 113, 125);
  --site-header-bgc: rgb(29, 32, 33);
  --site-header-shadow: rgb(58, 73, 53);
  /* body */
  --site-body-bgc: rgb(13, 13, 13);
  --site-body-img: '';
  --site-body-linear: '';
  /* home */
  --site-home-banner: url('/static/svg/home-banner2.svg');
  --site-home-shadow: rgba(64, 47, 0, 0.505);
  --site-home-title: rgb(130, 171, 142);
  --site-home-bgc: rgb(32, 33, 29);
  --site-home-subtitle: rgb(146, 141, 118);
  --site-home-header-shadow: #2d3d51;
  --site-home-describe-bgc: var(--background-secondary);
  --site-home-describe-border: var(--border-primary);
  --site-home-text-color01: rgb(134, 178, 126);
  --site-home-text-color02: rgb(170, 156, 51);
  --site-home-subject-bgc: rgba(50, 59, 54, 0.504);
  /* category */
  --view-category-bgc: #262723;
  --view-category-title-bgc: linear-gradient(132deg, #83946d 0.00%, #6d8b89 100.00%);
  --view-category-bgc-01: #292E29;
  /* article */
  --view-article-title-bgc: linear-gradient(132deg, #a9afa1 0.00%, #23867f 100.00%);
  --view-article-content-bgc: rgb(30, 29, 28);
  --linear-01: linear-gradient(90deg, #589154 0.00%, #1F2623 100.00%);
  --linear-02: linear-gradient(90deg, #b5afa3 0.00%, #a19e66 100.00%);
  /* code */
  --bgc-pre: #1D2021;
  --bgc-code: #1d2501;
  --text-code: #EBDBA4;
  /* menu bar */
  --card-left-side-bgc: rgb(29, 32, 33);
  --side-item-tc: rgb(217, 255, 220);
  --side-hover-item-bgc: rgba(98, 107, 81, 0.505);
  --side-hover-item-tc: rgb(255, 255, 255);
  --side-active-item-bgc: rgb(98, 107, 81);
  --side-active-item-tc: rgb(195, 222, 196);
  /* toc */
  --card-right-side-bgc: rgb(32, 35, 32);
  /* footer */
  --site-footer-bgc: rgba(30, 63, 46, 0.553);

  --comment-linear-01: linear-gradient(130deg, #252922e9 0%, #262926d4 50%, #0e0e0d81 100%);
  --comment-linear-02: linear-gradient(330deg, #252922e9 0%, #202220d4 50%, #0e0e0d81 100%);
  --comment-header-bgc: #272925;
  --comment-title-fc: rgb(130, 185, 145);
  --comment-border-primary: #a2a3a272;
  --comment-border-secondary: #a2a3a272;
  --comment-box-bgc: #1D2021;
  --comment-box-input-bgc: #1D2021;
  --comment-box-linear: linear-gradient(330deg, #252922e9 0%, #202220d4 50%, #0e0e0d81 100%);


  --title-tc-01: #472c01;
  --subtitle-tc-01: #423600;

  --view-bgc-01: #21211e;
  --view-bgc-02: #34332f;
  --view-bgc-03: #2d2c298d;

  --shadow-01: #56624b81;
  --shadow-02: #586453b2;
  --shadow-03: #8fd47c00;

  --linear-03: linear-gradient(90deg, #374837 1%, #415f42 1% 6%, #8b936f 6% 11%,
      #c6d4be 11% 89%, #8b936f 89% 94%, #415f42 94% 99%, #374837 99%);
}

::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

::-webkit-scrollbar-track {
  /* background: var(--scroll-track); */
  border-radius: 10px;
}

::-webkit-scrollbar-thumb {
  background: #a19888;
  border-radius: 5px;
}

::-webkit-scrollbar-thumb:hover {
  background: #968967;
}